// 获取默认attrs
import {
	getDefaultAttrs
} from './attrs.js';
// 获取子组件
import {
	getChild
} from './slots.js';
// 导出新组件
export default {
	props: ['value', 'type', 'options', 'disabled','readonly'],
	name: 'el-component',
	render(h) {
		const self = this;
		const slots = Object.keys(this.$slots)
			.reduce((arr, key) => arr.concat(this.$slots[key]), [])
			.map(vnode => {
				vnode.context = this._self
				return vnode
			});
		// 获取子组件,如果有的话
		let child = getChild(this.type, h, this.options);
		// 获取事件监听
		let events = this.$attrs.on || {};
		// 渲染函数中没有与 v-model 的直接对应——必须自己实现相应的逻辑
		events['input'] = function(event) {
			self.$emit('input', event);
		}
		// 参数传进来的attrs
		let attrsinset = this.$attrs.attrs || {};
		// 默认的attrs
		let defaultAttrs = getDefaultAttrs(this.type);
		// 根据type渲染组件
		// console.log('this.$props',this.$props)
		return h(`el-${this.type}`, {
			on: events,
			props: {...this.$props},
			// 透传 scopedSlots
			scopedSlots: this.$scopedSlots,
			attrs: {
				...attrsinset,
				...defaultAttrs,
				disabled: this.disabled,
				readonly: this.readonly,
			}
		}, [...slots, ...child]);
	}
}
